<template>
    <view class="content">
        <view class="login">
        	<text class="title">{{title}}</text>
        </view>
        <view class="form">
            <view class="jg"></view>
            <view class="jg"></view>
            <view class="text-area">
                <input type="text" v-model="formObj.$uname" placeholder="用户名" focus="true" />
            </view>
            <view class="jg"></view>
            <view class="text-area">
                <input type="password" v-model="formObj.$pwd" placeholder="密码" />
            </view>
            <view class="jg"></view>
            <view class="text-area">
                <button type="default" @click="login()">登录</button>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                formObj: {
                    $uname: '',
                    $pwd: ''
                },
                title: '登录'
            }
        },
        onLoad() {
            
        },
        methods: {
            Toast($str, $icon = 'none') {
                uni.showToast({
                    icon: $icon,
                    title: $str
                })
            },
            login() {
                let {$uname, $pwd} = this.formObj
                if ($uname === '') {
                    this.Toast('用户名不能为空', 'error')
                    return false
                } else if ($pwd === '') {
                    this.Toast('密码不能为空', 'error')
                    return false
                } else {
                    uni.request({
                        url: 'http://api.roy.cn/login/index',
                        data: {
                            mobile: $uname,
                            password: $pwd
                        },
                        header: {
                            'Content-Type':'application/x-www-form-urlencoded'
                        },
                        method: 'POST',
                        success: ($info) => {
                            console.log($info.data)
                            let $data = $info.data
                            if ($data.code === 200) {
                                this.Toast($data.msg, 'success')
                            } else {
                                this.Toast($data.msg)
                            }
                        }
                    })
                }
            }
        }
    }
</script>

<style>
    .content{background: #333333;margin: 0;padding: 0;}
    .login{width: 100%;height: 50px;line-height: 50px;text-align: center;}
    .title {font-size: 42rpx;color: #efefef;font-weight: bold;}
    .form{width: 100%;}
    .jg{width: 100%; height: 10px;}
	.text-area{width: 90%;height: 50px;margin: 0 auto;}
    .text-area input{border: solid 1px #666666;height: 48px;line-height: 48px;background-color: #FFFFFF;text-indent: 20px;}
</style>
